<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>
  <title>Grid Cells</title>
  <link href="../raxan/styles/master.css" rel="stylesheet" type="text/css" />
  <!--[if IE]><link rel="stylesheet" href="../raxan/styles/master.ie.css" type="text/css"><![endif]-->
  <style type="text/css">
      .eee, .ddd, .ccc { color:#777; }
      .eee { background:#eee;  }
      .ddd { background:#ddd;  }
      .ccc { background:#ccc;  }
      .color1 { background:#ECECBB;  }
      .color2 { background:#CCFF99;  }
      .color3 { background:#FFCCCC;  }
      .color4 { background:#CCFFFF;  }
  </style>
</head>

<body>
<div class="container c37 hlf-pad lightgray">&nbsp;<a href="index.html" title="Back to the Examples Web Page"><img src="images/arrow_left.png" width="16" alt="Menu"/> Examples</a> | Raxan Framework&nbsp;</div>
<div class="container c37 tpm">
    <h1>Grid Cells</h1>
    <hr />
    <h2>An example of a the grid layout</h2>
    <hr />
    <div class="column bmm r3 eee c2">c2</div>
    <div class="column bmm r3 ddd c4">c4</div>
    <div class="column bmm r3 ddd c6">c6</div>

    <div class="column bmm r3 color3 c4">c4</div>
    <div class="column bmm r3 ccc c5">c5</div>
    <div class="column bmm r3 ccc c5">c5</div>
    <div class="column bmm r3 ccc c7">c7</div>
    <div class="column bmm r3 ddd c6">c6</div>
    <div class="column bmm r3 eee c1">c1</div>
    <div class="column bmm r3 ccc c3">c3</div>
    <div class="column bmm r3 ccc c3">c3</div>
    <div class="column bmm r3 color2 c7">c7</div>

    <div class="column bmm r3 ccc c3">c3</div>
    <div class="column bmm r3 ddd c1">c1</div>
    <div class="column bmm r3 ddd c5">c5</div>
    <div class="column bmm r3 ddd c3">c3</div>

    <div class="column bmm r3 ccc c6">c6</div>
    <div class="column bmm r3 ccc c2">c2</div>
    <div class="column bmm r3 eee c3">c3</div>
    <div class="column bmm r3 ddd c7">c7</div>

    <div class="column bmm r3 color1 c6">c6</div>
    <div class="column bmm r3 eee c7">c7</div>
    <div class="column bmm r3 ccc c2">c2</div>

    <hr />

    <div class="column bmm r3 eee c2">c2</div>
    <div class="column bmm r3 ccc c5">c5</div>
    <div class="column bmm r3 ddd c4">c4</div>
    <div class="column bmm r3 eee c6">c6</div>

    <div class="column bmm r3 eee c4">c4</div>
    <div class="column bmm r3 color4 c5">c5</div>
    <div class="column bmm r3 ccc c7">c7</div>

    <div class="column bmm r3 ddd c6">c6</div>
    <div class="column bmm r3 ccc c2">c2</div>
    <div class="column bmm r3 eee c1">c1</div>
    <div class="column bmm r3 ccc c3">c3</div>
    <div class="column bmm r3 ccc c3">c3</div>

    <div class="column bmm r3 ccc c3">c3</div>
    <div class="column bmm r3 color2 c7">c7</div>
    <div class="column bmm r3 ddd c5">c5</div>
    <div class="column bmm r3 ddd c2">c2</div>


</div>

</body>

</html>
